<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="../d3-tip.css" />
  </head>
  <body>


    <script src="../d3.js"></script>
    <script src="../d3-v6-tip.js"></script>
    <script>
      const data = [
        {company:'阿里',type:'电子产品',sale:125},
        {company:'阿里',type:'服装',sale:352},
        {company:'阿里',type:'食品',sale:520},
        {company:'京东',type:'电子产品',sale:438},
        {company:'京东',type:'服装',sale:85},
        {company:'京东',type:'食品',sale:266},
        {company:'拼多多',type:'电子产品',sale:92},
        {company:'拼多多',type:'服装',sale:316},
        {company:'拼多多',type:'食品',sale:283},
      ];
      const keys = ['食品','电子产品','服装'];
      // const datas = d3.group(data,d=>d.company)
      // const stack = d3.stack()
      //   .keys(keys)
      //   .value(function(array,key){
      //       const arr = array[1]
      //       for(let i=0;i<arr.length;i++){
      //           if(arr[i].type == key)
      //               return arr[i].sale;
      //       }
      //   })
      
      const datas = d3.index(data,d=>d.company,d=>d.type);
      const stack = d3.stack()
        .keys(keys)
        .value(function(array,key){
          console.log(arguments);
          return array[1].get(key).sale
        })
    </script>
  </body>
</html>
